﻿@model NAccounting.Models.ActivityDetailsModel

@{
    ViewBag.Title = "Edit";
}

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>

<script language="javascript">
    $(function () {

        var expectedToStartCalendarName = "ExpectedToStartCalendar";
        var expectedToEndCalendarName = "ExpectedToEndCalendar";

        var expectedToStartFieldName = "ExpectedToStart";
        var expectedToEndFieldName = "ExpectedToEnd";

        var saveButtonName = "saveButton";
        var deleteButtonName = "deleteButton";
        var generateAppointmentButton = "generateAppointmentButton";

        var confirmDeleteDialogName = "dialog-confirm";

        var deleteRecordUrl = '@Url.Action("Delete", new { Id = Model.Id })';
        var generateAppointmentUrl = '@Url.Action("Create", "Appointment",  new { Project = Model.ProjectId, Activity = Model.Id })'

        var dates = $("#" + expectedToStartCalendarName + ", #" + expectedToEndCalendarName + "").datepicker({
            showButtonPanel: true,
            changeMonth: true,
            numberOfMonths: 1,
            onSelect: function (selectedDate) {
                var option = this.id == expectedToStartCalendarName ? "minDate" : "maxDate",
					    instance = $(this).data("datepicker"),
					    date = $.datepicker.parseDate(
						    instance.settings.dateFormat ||
						    $.datepicker._defaults.dateFormat,
						    selectedDate, instance.settings);
                dates.not(this).datepicker("option", option, date);
            }
        });

        $('#' + expectedToStartCalendarName).datepicker('option', { altField: "#" + expectedToStartFieldName, maxDate: new Date() });
        $('#' + expectedToEndCalendarName).datepicker('option', { altField: "#" + expectedToEndFieldName, minDate: new Date() });

        //$('#PeriodStartCalendar').datepicker('setDate', new Date(periodStart));
        //$('#PeriodEndCalendar').datepicker('setDate', new Date(periodEnd));

        $("#" + saveButtonName).click(function () {
            $("form").submit();
        });

        $("#" + deleteButtonName).click(function () {
            $("#" + confirmDeleteDialogName).dialog({
                resizable: false,
                height: 160,
                modal: true,
                buttons: {
                    "Sim": function () {
                        window.location.href = deleteRecordUrl
                    },
                    "Não": function () {
                        $(this).dialog("close");
                    }
                }
            });
        });

        $("#" + generateAppointmentButton).click(function () {
            window.location.href = generateAppointmentUrl;
        });
    });
</script>

<div class="content-left">
    @Html.Partial("ContentLeftPartial")
</div>
<div class="content-right">
    <div id="dialog-confirm" title="Confirmar exclusão" style="display:none;">
	    <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>Este registro será excluído permanentemente. Deseja realmente excluir excluir este registro?</p>
    </div>

    <h2>Edit</h2>
    <p>
        <button id="goToListButton" class="button-icon-return-icon-only">Voltar</button> | 
        <button id="saveButton" class="submit">Salvar</button>
        <button id="deleteButton">Excluir</button>
        <button id="generateAppointmentButton">Gerar Apontamento</button>
    </p>
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    @Html.HiddenFor(model => model.Id)
    @Html.HiddenFor(model => model.ProjectId)

    <div>
        <h3>Detalhes</h3>
        <div class="editor-label">
            @Html.LabelFor(model => model.ProjectName): <span class="bold">@Html.DisplayTextFor(model => model.ProjectName)</span>
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Name):
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.Name, new { size = 62, placeholder = "Nome da atividade" })
            @Html.ValidationMessageFor(model => model.Name)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Description):
        </div>
        <div class="editor-field">
            @Html.TextAreaFor(model => model.Description, new { placeholder = "Descrição da atividade" , rows = 5, cols = 65  })
            @Html.ValidationMessageFor(model => model.Description)
        </div>
        <div style="margin-top:2px;" class="editor-label">
            @Html.CheckBoxFor(model => model.IsActive) @Html.LabelFor(model => model.IsActive)
        </div>
        <h3>Período</h3>
        <div class="editor-label">
            Período do projeto:
        </div>
        <div class="editor-label">
            <table>
                <tr>
                    <td width="205">@Html.LabelFor(model => model.ExpectedToStart) @Html.TextBoxFor(model => model.ExpectedToStart, new { @class = "textBoxReadOnly" }) </td>
                    <td>@Html.LabelFor(model => model.ExpectedToEnd) @Html.TextBoxFor(model => model.ExpectedToEnd, new { @class = "textBoxReadOnly" }) </td>
                </tr>
                <tr>
                    <td>
                        <div id="ExpectedToStartCalendar"></div>
                    </td>
                    <td>
                        <div id="ExpectedToEndCalendar"></div>
                    </td>
                </tr>
            </table>
        </div>
    </div>
    <p>&nbsp;</p>
}

</div>